body{
	background: #ffcccc;
	margin: 0px;
	padding: 0px;
	font-family: Arial;
	position: relative;
}

#container{
	margin: 0px  auto;
	width: 1050px;
	height: 1900px;
	text-align: middle;
	background: #faebd7;
}

#pageHeader{
	margin: 0px;
	padding: 25px;
	background: #996666;
	height: 80px; 
	width: 1000px;
	border-top-left-radius: 50px;
	border-top-right-radius: 50px;

}

#pageHeader h1{
	font-size: 50px;
	color:#faebd7;
	margin-top: 10px;
	float: left;
}

#pageHeader h2{
	font-size: 20px;
	color:#faebd7;
	float: left;
}

#globallink{
	margin: 0px;
	padding: 0px;
	height: 30px;
	width: 100%;
}

#globallink ul{
    list-style-type: none;
    padding: 0px;
    margin: 0px; 
}

#globallink ul li{
	float: left;
	text-align: center;
	width: 150px;
}

#globallink ul li a{
	display: block;
	padding: 9px 6px 9px 6px;
	margin: 0px;
	background: url("images/9.jpg")  no-repeat;
}

#globallink ul li a:link,#globallink ul li a:visited{
	color: #ff6666;
	text-decoration: none;
	font-size: 15px;
}

#globallink ul li a:hover{
	color: white;
    text-decoration: none;
	font-size: 15px;
	background: url("images/10.jpg") no-repeat;
}

#slide{
	margin-top: 19px;
	margin-left: 10px;
	width: 500px; 
	height: 400px;  
    overflow: hidden; 
    position: relative;
    border: 5px solid #cc9999;
    float: left;
}

 #list { 
 	width: 4200px;
    height: 400px; 
    position: absolute; 
    z-index: 1;
}

#list img { 
	float: left;
}

 #buttons {
    position: absolute; 
 	height: 10px; width: 100px; 
 	z-index: 2; bottom: 20px; 
 	left: 230px;
 }

 #buttons span { 
 	cursor: pointer; 
 	float: left; 
 	border: 3px solid  #996666; 
 	width: 10px; height: 10px; 
 	border-radius: 50%;
 	background:  #ffcccc;
    margin-right: 5px;
}

 #buttons .on {  
 	background: #ff6699;
 }

 .arrow { 
 	cursor: pointer; 
 	display: none;
    line-height: 40px;
    text-align: center; 
    font-size: 40px;  
 	width: 40px; 
 	height: 40px;  
 	position: absolute; 
    z-index: 2;
 	top: 180px; 
 	background-color: RGBA(0,0,0,.3); 
 	color: #ffcccc;
 }

 .arrow:hover { 
 	background-color: RGBA(0,0,0,.7);
 }

 #slide:hover .arrow { 
 	display: block;
 }

 #prev { 
 	left: 20px;
 	text-decoration: none; 
 }
    
 #next { 
 	right: 20px;
 	text-decoration: none;
 }

h3 a{
 	display: block;
 	font-size: 30px;
 	background: #996666; 
 }

h3 a:link, h3 a:visited{
	color: #faebd7;
	text-decoration: none;
}

h3 a:hover{
	color: white;
    text-decoration: none;
	background: url("images/a.jpg") no-repeat;
}

p{
 	background: #ffcccc;
 	font-size: 16px;
 }

p a{
 	color: #ff6699;
 }
 

#personalInformation{
    width: 490px;
    float: right;
    margin-right: 10px;
    float: right;
}  

#Skills{
	width: 510px;
	float: left;
	margin-left: 10px;
	margin-top: 50px;
	float: left;
	position: relative;
}

#Skills p{ 
   font-size: 20px;
   background: #faebd7; 
   line-height: 33px;
}

#n1{
	width: 400px;
	height: 18px;
	position: absolute;
	background: #f99;
	top:82px;
	left: 70px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

#n2{
	width: 40px;
	height: 18px;
	position: absolute;
	background: #678;
    top: 82px;
	left: 470px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	
}  
        
#n3{
	width: 225px;
	height: 18px;
	position: absolute;
	background: #f99;
	top:136px;
	left: 70px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
} 
        
       
#n4{
	width: 215px;
	height: 18px;
	position: absolute;
	background: #678;
	top:136px;
	left: 295px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	
} 

#n5{
	width: 40px;
	height: 18px;
	position: absolute;
	background: #f99;
	top:190px;
	left: 70px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
} 

#n6{
	width: 400px;
	height: 18px;
	position: absolute;
	background: #678;
	top: 190px;
	left: 110px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}     
        
#n7{
	width: 10px;
	height: 18px;
	position: absolute;
	background: #f99;
	top: 244px;
	left: 70px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
} 

#n8{
	width: 430px;
	height: 18px;
	position: absolute;
	background: #678;
	top: 244px;
	left: 80px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
} 

#n9{
	width: 10px;
	height: 18px;
	position: absolute;
	background: #f99;
	top: 298px;
	left: 70px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
} 

#n10{
	width: 430px;
	height: 18px;
	position: absolute;
	background: #678;
	top:298px;
	left: 80px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}  

#n11{
	width: 100px;
	height: 18px;
	position: absolute;
	background: #f99;
	top:352px;
	left: 70px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

#n12{
	width: 340px;
	height: 18px;
	position: absolute;
	background: #678;
	top:352px;
	left: 170px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}      

#self-evaluation,#aboutHCI{
	width: 510px;
	float: left;
	margin-top: 15px;
	margin-left: 10px;
	float: left;
	line-height: 30px;
}

#pojectExperiences,#aboutTheFrontEnd,#instruction{
	width: 490px;
	float: right;
	margin-right: 10px;
	margin-top: 5px;
	float: right;
	line-height: 30px;
}

#aboutHCI,#instruction{
	margin-bottom: 80px;
}


#footer{
	margin: 0px;
	padding: 25px;;
	background: #996666;
	height: 80px; 
	width: 1000px;
	clear: both;
}



#footer h2{
	position: relative;
    font-size: 20px;
	color:#faebd7;
	text-align: center;
}

#footer h2 a{
	color: #faebd7;
}